

	.imageChat-wrapper-box {
	  height: 100vh;
	  background-image: url('https://cdn.osisx.com/images/imbg1.png');
	  background-size: cover;
	  background-repeat: no-repeat;
	  background-attachment: fixed;
    position: relative;
    z-index: 0;

	  .msg-single-box {

	   position: absolute;
	   bottom: 30%;
    width: 100vw;
 display: flex;
 justify-content: center;
 align-items: center;
padding: 0 20rpx;
flex-direction: column;
	   .content-box{
		   padding: 30rpx;
		   background: rgba(255, 255, 255, 0.3);
		    width: 100%;
		   min-height: 100rpx;
		   border-radius: 60rpx;
		      font-family: fangsong;
		      font-weight: bold;
		      // color: #4C3E3B;
		      font-size: 32rpx;
		      line-height: 40rpx;
	   }
	   .select-box{
		   margin-top: 50rpx;
		   width: 100%;
		   height: auto;
		   display: flex;
		   flex-direction: column;
		   justify-content: center;
		   align-items: center;
		   .action{
		   	flex: 1;
		   	margin: 10rpx 20rpx;
			width: 100%;
		   }
	   }
	  }

	  .im-heartbeat-box {
	    display: flex;
	    align-items: center;
	    position: fixed;
	    top: 115rpx;
	    left: 100rpx;
	    z-index: 1000;

	    .heartbeat-title {
	      font-size: 22rpx;
	      color: #ED447D;
	      margin-right: 12rpx;
	    }

	    .heartbeat-x {
	      font-size: 28rpx;
	      color: #ED447D;
	      margin-left: 8rpx;
	      margin-right: 8rpx;
	    }
	  }
	}




	.scroll-view-box {
	  // bottom: 170rpx;
	  // top: 580rpx;
	  box-sizing: border-box;
	  transition: all 0.5s ease;
	  /* 添加过渡动画 */
	}
	.backIcon {
	  background-color: transparent;
	  position: fixed;
	  top: 112rpx;
	  left: 34rpx;

	}


	.msgLoad-box {
	  display: flex;
	  align-items: flex-start;

	  .avatar-box {
	    margin-right: 12rpx;
	  }

	  .mgs-box {
	    display: flex;
	    align-items: center;
	    background-color: #FBECF1;
	    padding: 20rpx 20rpx;
	    border-radius: 4rpx 24rpx 24rpx 24rpx;
	  }

	  .msgLoading {
	    font-size: 30rpx;
	    font-family: PingFangSC, PingFang SC;
	    font-weight: 400;
	    color: #181818;
	  }
	}


	.order-time {
	  margin-top: 15rpx;
	  white-space: nowrap;
	  text-overflow: ellipsis;
	  overflow: hidden;
	}



	.order-list {
	  display: flex;
	  color: black;
	  font-size: 20rpx;
	  font-weight: bold;
	  width: 95%;
	}

	.order-sn {
	  width: 350rpx;

	}

	.name-or-time {
	  width: 200rpx;
	  margin: 15rpx 15rpx;

	}


	.goods-card {
	  border-radius: 20rpx;
	  margin-top: 15rpx;
	  background-color: #ffffff;
	  padding-left: 12rpx;
	  width: 95%;
	  height: 120rpx;
	  display: flex;
	  flex-wrap: wrap;
	  color: #302c2b;



	  .image-box {
	    width: 122rpx;
	    height: 122rpx;
	    overflow: hidden;

	    .image {
	      width: 122rpx;
	      border-radius: 10rpx;
	    }
	  }

	  .goods-desc {
	    flex: 1;
	    overflow: hidden;
	    margin-left: 12rpx;
	    width: 400rpx;

	    .goods-desc-name {
	      font-size: 30rpx;
	      line-height: 1.5;
	      white-space: nowrap;
	      text-overflow: ellipsis;
	      overflow: hidden;
	      margin-bottom: 20rpx;


	      .goods-card-goods-name {
	        color: black;
	        text-overflow: ellipsis;
	        font-size: 26rpx;
	        font-weight: bold;
	      }
	    }

	    .price {
	      margin-top: 50rpx;
	      line-height: 2;
	      margin-left: 5px;
	      font-size: 26rpx;
	      font-weight: 700;
	    }
	  }

	  .send-goods {
	    color: #ffffff;
	    height: 50rpx;
	    width: 130rpx;
	    background-color: #f21c0c;
	    font-size: 24rpx;
	    border-radius: 17rpx;
	    text-align: center;
	    line-height: 50rpx;
	    padding: 0 10rpx;
	    position: relative;
	    top: 20rpx;
	    right: 20rpx;
	  }
	}

	.cancel {
	  color: #737373;
	  position: relative;
	  bottom: 40rpx;
	  left: 12%;
	}

	.cart-message {
	  display: flex;
	  justify-content: center;
	  align-items: center;
	}

	.bottom-dh-char {
	  // background: linear-gradient(180deg, rgba(5, 34, 104, 0) 0%, #141523 100%);
	  background: linear-gradient(180deg, rgba(5, 34, 104, 0) 0%, #ededed 100%);
	  width: 100vw;
	  height: 170rpx;
	  padding: 16rpx 34rpx 20rpx 34rpx;
	}

	.bottom-dh-char-top {
	  background: linear-gradient(180deg, rgba(5, 34, 104, 0) 0%, #ededed 100%);
	  width: 100vw;
	  height: 120rpx;
	  padding: 16rpx 34rpx 20rpx 34rpx;
	}


	.user-name {
	  text-align: right;
	  font-size: 24rpx;
	  color: #737373;
	  margin-bottom: 10rpx;
	  margin-right: 10rpx;
	}

	.other-name {
	  text-align: left;
	  font-size: 24rpx;
	  color: #737373;
	  margin-bottom: 10rpx;
	  margin-left: 10rpx;
	}



	.column-time {
	  justify-content: center;
	  color: #CDCDCD;
	}



	.chat-img {
	  border-radius: 50%;
	  width: 84rpx;
	  height: 84rpx;
	  // background-color: #f7f7f7;
	}

	.padding-chat {
	  padding: 20rpx 20rpx;
	}

	.tb-nv {
	  width: 50rpx;
	  height: 50rpx;
	}

	.goods-desc-rice {
	  font-size: 24rpx;
	  color: $main-color;
	  font-weight: bold;
	  margin-top: 10rpx;
	}

	.order-item {
	  margin: 10rpx 0
	}


	uni-page-head {
	  position: fixed;
	  top: 0;
	  left: 0;
	  right: 0;
	  z-index: 9999;
	}
	
	.returnStory{
		position: fixed;
	bottom: 150rpx;
    right: 40rpx;
	z-index: 21;
		.returnStoryImg{
			width: 45.79rpx;
			height: 48rpx;
		}
	}
	
	  .chat-item {
	    transition: opacity 0.3s; /* 添加过渡效果 */
	  }
	  
	  
	  .fade-in {
	    animation: fadeIn 1s;
	  }
	  
	  .fade-out {
	    animation: fadeOut 1s;
	  }
	  
	  @keyframes fadeIn {
	    from {
	      opacity: 0;
	    }
	    to {
	      opacity: 1;
	    }
	  }
	  
	  @keyframes fadeOut {
	    from {
	      opacity: 1;
	    }
	    to {
	      opacity: 0;
	    }
	  }